{extend name="layout/default" /}
{block name="css"}
<style media="screen">
.enter_btn a {
    width: 100%;
    display: block;
    margin-top: .5rem;
    background-color: #5CCC66;
    border-radius: 0;
    border: none;
    padding: .5rem 0;
    color: #fff;
    text-align: center;
}
</style>
{/block}
{block name="content"}
<div class="content">
    <div class="content-block">
		<div id="answer">
			{volist name="questions" id="v" key="k"}
			<div class="question" id="q{$k}" {if condition="$k != 1"}style="display:none;"{/if} data-id="{$v.id}">
		        <div class="">
					<p class="subject_t">{$v.title}</p>
					{volist name="$v->options" id="vv" key="kk"}
					<p><span><input id="cb{$k}_{$kk}" type="checkbox" value="{$vv.id}" name="cb{$k}" /></span> <label for="cb{$k}_{$kk}">{$vv.title}</label></p>
					{/volist}
				</div>
				<div id="msg{$k}" class="no_choice" style="display:none;">您还没选择！</div>
				<div class="enter_btn"><a id="b{$k}" href="javascript:void(0);">下一题</a></div>
			</div>
			{/volist}
		</div>
	</div>
</div>
{/block}

{block name="footer"}
{/block}
{block name="script"}
<script type="text/javascript">
	$(function () {
        var checkBoxArr = new Array();
        $("#b1").click(function () {
            var checkBoxArr1 = [];
            $('#q1 input:checkbox[name="cb1"]:checked').each(function() {
                checkBoxArr1.push($(this).val());
            });
            var key = $(this).parents('.question').data('id');
			if (checkBoxArr1.length == 0) {
				$("#msg1").fadeIn(500);
			} else {
                checkBoxArr[key] = checkBoxArr1;
				setTimeout('$("#q1").fadeOut(100);', 1);
				setTimeout('$("#q2").fadeIn(1000);', 100);
			}
		});
		$("#b2").click(function () {
            var checkBoxArr2 = [];
            $('#q2 input:checkbox[name="cb2"]:checked').each(function() {
                checkBoxArr2.push($(this).val());
            });
            var key = $(this).parents('.question').data('id');
			if (checkBoxArr2.length == 0) {
				$("#msg2").fadeIn(500);
			} else {
                checkBoxArr[key] = checkBoxArr2;

				setTimeout('$("#q2").fadeOut(100);', 1);
				setTimeout('$("#q3").fadeIn(1000);', 100);
			}
		});
		$("#b3").click(function () {
            var checkBoxArr3 = [];
            $('#q3 input:checkbox[name="cb3"]:checked').each(function() {
                checkBoxArr3.push($(this).val());
            });
            var key = $(this).parents('.question').data('id');
			if (checkBoxArr3.length == 0) {
				$("#msg3").fadeIn(500);
			} else {
                checkBoxArr[key] = checkBoxArr3;

				setTimeout('$("#q3").fadeOut(100);', 1);
				setTimeout('$("#q4").fadeIn(1000);', 100);
			}
		});
		$("#b4").click(function () {
            var checkBoxArr4 = [];
            $('#q4 input:checkbox[name="cb4"]:checked').each(function() {
                checkBoxArr4.push($(this).val());
            });
            var key = $(this).parents('.question').data('id');
			if (checkBoxArr4.length == 0) {
				$("#msg4").fadeIn(500);
			} else {
                checkBoxArr[key] = checkBoxArr4;

				setTimeout('$("#q4").fadeOut(100);', 1);
				setTimeout('$("#q5").fadeIn(1000);', 100);
			}
		});
		$("#b5").click(function () {
            var checkBoxArr5 = [];
            $('#q5 input:checkbox[name="cb5"]:checked').each(function() {
                checkBoxArr5.push($(this).val());
            });
            var key = $(this).parents('.question').data('id');
			if (checkBoxArr5.length == 0) {
				$("#msg5").fadeIn(500);
			} else {
                checkBoxArr[key] = checkBoxArr5;

				setTimeout('$("#q5").fadeOut(100);', 1);
				setTimeout('$("#q6").fadeIn(1000);', 100);
			}
		});
		$("#b6").click(function () {
            var checkBoxArr6 = [];
            $('#q6 input:checkbox[name="cb6"]:checked').each(function() {
                checkBoxArr6.push($(this).val());
            });
            var key = $(this).parents('.question').data('id');
			if (checkBoxArr6.length == 0) {
				$("#msg6").fadeIn(500);
			} else {
                checkBoxArr[key] = checkBoxArr6;

				setTimeout('$("#q6").fadeOut(100);', 1);
				setTimeout('$("#q7").fadeIn(1000);', 100);
			}
		});
		$("#b7").click(function () {
            var checkBoxArr7 = [];
            $('#q7 input:checkbox[name="cb7"]:checked').each(function() {
                checkBoxArr7.push($(this).val());
            });
            var key = $(this).parents('.question').data('id');
			if (checkBoxArr7.length == 0) {
				$("#msg7").fadeIn(500);
			} else {
                checkBoxArr[key] = checkBoxArr7;

                console.log(checkBoxArr);
                $.ajax({
                	url: "{:url('course/complete')}",
                	type: 'POST',
                	data: {data: checkBoxArr},
                    success: function(data) {
                        if(data.code) {
                            window.location.href = "{:url('course/complete')}";
                        }else{
                            alert(data.msg);
                        }
                    }
                })
			}
		});
	});
</script>
{/block}
